<script setup lang="ts">
import { ref } from 'vue'
const isshow = ref(false)

function onscroll() {
    if (window.scrollY > 10) {
        isshow.value = true
    } else {
        isshow.value = false
    }
}

window.onscroll = onscroll


const emit = defineEmits()
function showClick() {
    emit('abc', true)
}
</script>


<template>
    <div class="hotel-nav" v-show="isshow">
        <div class="left">
            <van-image @click="$router.go(-1)"
                src="https://cdn7.axureshop.com/demo2024/2251242/images/%E6%90%9C%E7%B4%A2/u459.svg"></van-image>
            <b style="margin-left: 20px;color: #333;font-size: 16px; ">北京望京希尔顿欢朋酒店</b>
        </div>

        <div class="right">
            <van-image @click="showClick"
                src="https://cdn7.axureshop.com/demo2024/2251242/images/%E6%99%AF%E7%82%B9%E4%B8%BB%E9%A1%B5/u581.svg"></van-image>
        </div>
    </div>
</template>


<style scoped lang="scss">
.hotel-nav {
    width: 100%;
    height: 100px;
    background-color: white;
    display: flex;
    justify-content: space-between;
    align-items: center;
    position: fixed;
    top: 0;
    z-index: 99;

    .left {
        margin-left: 20px;
    }

    .right {
        margin-right: 20px;
    }
}
</style>